Membuat Button Follow Me on Twitter

Ini merupakan salah satu trik untuk mempercantik dan mempromosikan blog kita :D Untuk membuat button Follow Me on Twitter ini cukup mudah dan gak butuh waktu sampe berjam-jam untuk membuatnya. Berikut langkah-langkah pembuatannya :

1. Login ke blogger
2. Masuk ke dashboard blog Anda
3. Klik menu Tata Letak kemudian Tambahkan Gadget
4. Pilih HTML/Javascript kemudian copy code dibawah ini :

   <a href="//twitter.com/boegatane420" class="twitter-follow-button"
   data-show-count="true">Follow My Twitter</a>
   <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];
   if(!d.getElementById(id)){js=d.createElement(s);js.id=id;
   js.src="//platform.twitter.com/widgets.js";
   fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
   </script>

   Ganti tulisan yang berwarna merah dengan id Twitter Anda
5. Klik Simpan
6. Letakkan Gadget/Widget pada lokasi yang Anda inginkan
7. Kemudian Simpan Setelan

Mudah bukan ...
Sekian postingan mengenai membuat button follow me on twitter di blog. Semoga bermanfaat :)

read more »

Membuat Tab Accordion Vertical di Blog

Login ke blogger.com

<style type="text/css">
h5 {
font-family: trebuchet-ms, arial, tahoma;
font-size: 13px;
padding: 0 0 1em;
font-weight:bold;
color: #ffffff;
}
.msg_list {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.msg_head {
padding: 5px 10px;
cursor: pointer;
position: relative;
background-color:#0e0e0e;
margin:1px;
}
.msg_body {
padding: 5px 10px 15px;
background-color:#F4F4F8;
}
</style>


<script type="text/javascript" src="http://javscript-code.googlecode.com/files/menuaccordion.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//slides the element with class "msg_body" when paragraph with class "msg_head" is clicked
$("#firstpane h5.msg_head").click(function()
{
$(this).next("div.msg_body").slideToggle(700).siblings("div.msg_body").slideUp("slow");
});
//slides the element with class "msg_body" when mouse is over the paragraph
$("#secondpane h5.msg_head").mousedown(function()
{
$(this).next("div.msg_body").slideDown("slow").siblings("div.msg_body").slideUp("slow");
});
});
</script>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">JUDUL TAB</h5>
<div class="msg_body">
ISI TAB MENU
</div>
<h5 class="msg_head">JUDUL TAB</h5>
<div class="msg_body">
ISI TAB MENU
</div>
<h5 class="msg_head">JUDUL TAB</h5>
<div class="msg_body">
ISI TAB MENU
</div>
<h5 class="msg_head">JUDUL TAB</h5>
<div class="msg_body">
ISI TAB MENU
</div>
</div>

Semoga bermanfaat ;)

read more »

Membuat Warna Table berselingan didalam Postingan

Login ke Blogger
Klik menu Template → Edit HTML
Cari kode ]]></b:skin> pada bagian template.
Untuk memudahkan pencarian gunakan tombol Ctrl + F pada keyboard kemudian paste code ]]></b:skin> pada bagian kolom search
Copy code dibawah ini dan letakkan diatas code ]]></b:skin> Klik Simpan template
Selesai dan saatnya pengujian .... Klik menu Pos kemudian Buat entri baru
Copy code dibawah ini didalam postingan pada Mode HTML
Klik tombol Pratinjau untuk melihat hasilnya diblog sebelum dipublikasikan
Jika sudah merasa pas klik tombol Publikasikan
Demikian tutorial cara membuat warna table berselingan didalam postingan. Semoga bermanfaat :)

read more »

Menghapus Footer Powered by Blogger di Blogspot

Footer merupakan catatan kaki yang ada dibagian paling bawah dari tampilan blog atau web kita. Selaku pemilik atau yang melakukan Customasi terhadap template blog atau CMS (Content Management System) pasti menyisipkan ID mereka dibagian footer. Nah, tentunya teman-teman sekalian juga ingin bukan untuk membuat footer sendiri pada blog teman-teman dan menghapus footer default dari Blogger seperti yang terlihat pada gambar disamping. Oke, ini juga merupakan salah satu trik jadul tapi sampai sekarang masih digunakan :D. Oke kita langsung saja ke langkah-langkahnya.

Cara Menghapus Footer Powered by Blogger

Langkah-langkah :

1. Login ke blogger.com
2. Masuk ke menu Template → Edit HTML
3. Cari code dibawah ini :

   <a class='home-link' expr:href='data:blog.homepageUrl'>
   <data:homeMsg/></a>

4. Kemudian Uncomment code tersebut sehingga menjadi seperti dibawah ini :

<!-- Menghapus tulisan beranda pada bagian footer di blogspot
    <a class='home-link' expr:href='data:blog.homepageUrl'>
<data:homeMsg/>
-->

5. Klik Simpan Template

Singkat dan mudah bukan :D
Sekian tutorial dari kami tentang cara menghapus footer Powered by Blogger di Blogspot. Semoga bermanfaat ;)

read more »

Menambahkan Widget Yahoo Messenger (Y!) di Blog

Mau punya fitur chatting Yahoo Messenger di blog atau web-nya ? Berikut kita sajikan cara menambahkan fasilitas chatting Yahoo Messenger (Y!). Merupakan trik yang terbilang jadul tapi masih sering kita jumpai di blog-blog atau website yang memasang fitur Y! ini dibagian widget pada blog atau website mereka. Untuk itu, kami juga ingin membagikan apa yang sudah kami dapat ke teman-teman.

Persiapan :
Akun email yahoo teman-teman

Cara Menambahkan Widget Yahoo Messenger (Y!)

Langkah-langkah menambahkan fasilitas Y! pada widget blog :

1. Login ke blogger.com
2. Masuk ke dashboard blog
3. Klik menu Tata Letak → Tambahkan Gadget
4. Pilih HTML/Javascript
5. Copy code dibawah ini kemudian paste pada gadget HTML/Javascript

   <center><a href="//ymsgr:sendIM?boegatane.official">
   <img border="0" 
   src="//opi.yahoo.com/online?u=boegatane.official&m=g&t=2"/>
   </a></center>

   Anda hanya perlu mengganti tulisan yang berwarna merah dan biru Tulisan yang berwarna merah merupakan username dari email anda yourmail@yahoo.com dan tulisan yang berwarna biru merupakan tampilan dari status Yahoo kita. Berikut beberapa id untuk status YM! yang disediakan oleh YM! :

1
Online	Offline
2
Online	Offline
3
Online	Offline
4
Online	Offline
5
Online	Offline
6
Online	Offline
7
Online	Offline
8
Online	Offline
9
Online	Offline
10
Online	Offline
11
Online	Offline
12
Online	Offline
13
Online	Offline
14
Online	Offline
15
Online	Offline
16
Online	Offline
17
Online	Offline
18
Online	Offline
19
Online	Offline
20
Online	Offline
21
Online	Offline
22
Online	Offline
23
Online	Offline
24
Online	Offline

6. Klik Simpan → Simpan Setelan

Sekian postingan mengenai cara menambahkan widget Yahoo Messenger di Blog. Semoga bermanfaat :)

read more »